<%-- 
    Document   : AddReservableUnit
    Created on : Oct 1, 2011, 5:38:27 AM
    Author     : KimberlyJordan
--%>

<%@page import="EntityState.PartnerAccountState"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@page import="java.util.List, java.util.ArrayList"%>
<%@page import="java.util.ArrayList, BusinessLogic.Constants" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <script language="javascript" type="text/javascript" src="../TransactWeb/js/jquery-1.6.4.min.js"></script>
        <script language="javascript" type="text/javascript" src="../TransactWeb/js/jquery.form.js"></script>
        <script type="text/javascript" src="../TransactWeb/js/fieldsetCollapse.js"></script>
        <script type="text/javascript" src="../TransactWeb/js/tcubmenu.js"></script>
        <script type="text/javascript" src="../TransactWeb/js/accordion.js"></script>
        <script type="text/javascript" src="../TransactWeb/js/scroller.js"></script>
        <script type="text/javascript" src="../partner/script/Utilities.js"></script>

        <link rel="stylesheet" type="text/css" href="../TransactWeb/css/gridsys.css" />
        <link rel="stylesheet" type="text/css" href="../TransactWeb/css/reset1.css" />
        <link rel="stylesheet" type="text/css" href="../TransactWeb/css/tcube.css" />
        <link href="../TransactWeb/css/gridsys.css" rel="stylesheet" type="text/css" />
        <link rel="stylesheet" type="text/css" href="../TransactWeb/css/tcubaccd.css" />
        <script type="text/javascript">
            // Check Session to show relevant menus
            // Be sure to import Utilities.js in the script file	and declare partnerMenu as a servelet element
            window.onload = showPage('partnerMenu', 'leftnav');

            // If not logged in, use : 
            //window.onload = showPage('topMenu', 'topmenu');
            //IF logged in use : 
            window.onload = showPage('topMenulogout', 'topmenu');

            //welcome msg
            window.onload = showPage('welcomeMenu','welcome');

            //footer
            window.onload = showPage('partnerFooter','footer');
            
            $(document).ready(function() {
                // bind 'myForm' and provide a simple callback function
                window.onload = showPage('partnerMenu', 'leftnav');
                $('#addReservableForm').ajaxForm({ 
                    success: function(response){
                        var status = $(response).find("status").text();
                        $("#addReservableStatus").html(status);
                    },
                    dataType: "xml"
                });
                
                $.ajax({
                    type: "GET",
                    url:  "GetInfo",
                    data: {
                        action: <%= Constants.GET_LIST_OF_OUTLETS%>
                    },
                    success: function(response) {
                        var options = [];
                        options.push('<option value="">Select an Outlet</option>');
                        $(response).find("outlet").each(function() {
                            var id = $(this).find("id").text();
                            var name = $(this).find("name").text();
                            options.push('<option value="',
                            id, '">',
                            name, '</option>');
                            
                        });
                        $("#outletID").html(options.join(''));
                    },
                    dataType: "xml"
                });
                
                $('#outletID').change(function () {
                    if ($('#outletID').val() != "") {
                        $('#itemList').show();
                        var options = [];
                        options.push('<option value="">Select an Item</option>');
                        $.ajax({
                            type: "GET",
                            url:  "GetInfo",
                            data: {
                                action: <%= Constants.GET_LIST_OF_OUTLET_ITEMS%>,
                                id: $('#outletID').val()
                            },
                            success: function(response) {
                                $(response).find("anItem").each(function() {
                                    var id = $(this).find("id").text();
                                    var name = $(this).find("name").text();
                                    options.push('<option value="',
                                    id, '">',
                                    name, '</option>');
                                }); 
                                $("#itemID").html(options.join(''));
                            },
                            dataType: "xml"
                        });
                    }  
                }) 
            }); 
        </script>
    </head>
    <body>
        <div class="container_12">
            <!-- Header Nav -->
            <div class="grid_3"><img src="../TransactWeb/img/reservation/foodsglogo.png" width="146" height="178" /></div>
            <div class="grid_9 nav"> 
                <div id="topmenu"></div>
            </div>

            <div class="grid_12">
                <hr size="3" color="#CC6600" />
            </div>
            <!-- Welcome Message -->
            <div class="grid_12 welcome">
                <div id="welcome"></div>

            </div>
            <!-- End Welcome Message-->

            <!-- End of Header Nav -->
            <!-- Menu / Planner -->
            <div class="grid_4">

                <div id="leftnav"></div>

            </div>
            <!--End Menu/ Planner -->
            <!-- Content -->
            <div class="grid_8 content">
                <!-- Content Header -->

                <table width="600" border="0">
                    <tr>
                        <td class="content_title">Reservable Units Management</td>
                    </tr>
                    <tr>
                        <td class="content_purpose">Add Reservable Units</td>
                    </tr>
                </table>
                <!-- End Content Header-->
                <!-- Form -->
                <div id="addReservableStatus" style="padding-left: 10px; color: #f7964f; margin-bottom: 10px;"></div>

                <form action="AddReservableUnitStatus" id="addReservableForm" method="post" enctype="multipart/form-data">
                    <table width="600" border="0" class="formstyle">
                        <tr>
                            <td width="194">Unit Name</td>
                            <td width="296"><input type="text" name="name"/></td>
                        </tr>
                        <%
                            for (int i = 1; i < Constants.FILE_MAX_NUM_OF_ITEM_PICTURE + 1; i++) {
                        %>
                        <tr>
                            <td width="194">Image <%= i%></td>
                            <td width="296"><input name="<%= i%>" type="file" /></td>
                        </tr>
                        <tr>
                            <td width="194">Description <%= i%></td>
                            <td width="296"><input type="text" name="<%= "description" + i%>" id="description" /></td>
                        </tr>
                        <%
                            }
                        %>

                        <tr>
                            <td>Description</td>
                            <td><input type="text" name="decription" id="decription" /></td>
                        </tr>
                        <tr>
                            <td>No. of Customers Per Unit</td>
                            <td><input type="text" name="numOfCustomersPerUnit" /></td>
                        </tr>
                        <tr>
                            <td>No. of Available Units</td>
                            <td><input type="text" name="numOfAvailableUnits" /></td>
                        </tr>
                        <tr>
                            <td>Outlet ID</td>
                            <td><select id="outletID" name="outletID">\</select></td>
                        </tr>
                        <tr id="itemList" style="display:none;">
                            <td>Item ID</td>
                            <td><select id="itemID" name="itemID"></select></td>
                        </tr>
                        <tr>

                            <td colspan="2"><input name="addunit" type="submit" value="Add Unit" /></td>
                        </tr>

                    </table>
                </form>

                <!-- End Form -->
            </div>
            <!-- End Content -->
            <!-- Footer -->
            <div class="grid_12 footer">
                <div id="footer"></div>

            </div>
            <!-- End Footer-->
        </div>
    </body>
</html>
